<%@ include file="top.jsp"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="/struts-tags" prefix="s" %>  
<%
String token = java.util.UUID.randomUUID().toString();
session.setAttribute("token", token);
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册Coding</title>
<link type="text/css" href="jquery/css/smoothness/jquery-ui-1.8.20.custom.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="jquery/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="jquery/themes/icon.css">
<script type="text/javascript" src="jquery/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="jquery/js/jquery-ui-1.8.20.custom.min.js"></script>

<script type="text/javascript" src="js/util.js"></script>

<link rel="stylesheet" type="text/css" href="css/myp.css">
<link rel="stylesheet" type="text/css" href="css/mylayout.css">
<link rel="stylesheet" type="text/css" href="css/myul.css">
<link rel="stylesheet" type="text/css" href="css/myil.css">
<link rel="stylesheet" type="text/css" href="css/mya.css">

<script type="text/javascript">
$(document).ready(function(){
var email_can = false;
var password_can = false;
var repassword_can = false;
var nickname_can = false;
var ver_can = false;


$('#temail').change(function(){
	var s = $('#temail').val();
	if (s==""){
		$('#pemail_tip').hide();
		email_can = false;
	} else if (checkEmail(s)==false){
		email_can = false;
		$('#pemail_tip').html("<font size='3' color='red'>请输入正确的邮箱地址</font>");
		$('#pemail_tip').show();
	} else {
		$.post('User_checkAccount?type=0&uvo.id='+s,function(result){
			if (result!=""){		
				$('#pemail_tip').html("<font size='3' color='red' face='楷体'>用户\""+ result +"\"已经存在!</font>");							
				email_can= false				;
			}else {
				$('#pemail_tip').html("<font size='3' color='#66CDAA' face='楷体'>用户可以使用</font>");
				email_can = true;
			}
			$('#pemail_tip').show();
		});
	}	
});

$('#ppassword').change(function(){
	var p = $('#ppassword').val();
	if (p==""){
		$('#ppassword_tip').hide();
		password_can = false;
	} else if (checkPassword(p)==false){
		$('#ppassword_tip').html("<font size='3' color='red' face='楷体'>6-20位不含空格的密码</font>");
		password_can = false;	
		$('#ppassword_tip').show();
	} else {
		$('#ppassword_tip').html("<font size='3' color='#66CDAA' face='楷体'>合法密码</font>");
		password_can = true;	
		$('#ppassword_tip').show();
	}	
});

$('#prepassword').change(function(){
	var p = $('#ppassword').val();
	var rep = $('#prepassword').val();
	if (rep==""){
		$('#prepassword_tip').hide();
		repassword_can = false;		
	} else if (p==rep){
		$('#prepassword_tip').html("<font size='3' color='#66CDAA' face='楷体'>合法密码</font>");
		repassword_can = true;	
		$('#prepassword_tip').show();
	} else {
		$('#prepassword_tip').html("<font size='3' color='red' face='楷体'>密码不一致</font>");
		repassword_can = false;
		$('#prepassword_tip').show();
	}	
});

$('#tnickname').change(function(){
	var s = $('#tnickname').val();
	if (s==""){
		$('#pnickname_tip').hide();
		nickname_can = false;
	} else {
		$.post('User_checkAccount?type=1&uvo.id='+s,function(result){
			if (result!=""){		
				$('#pnickname_tip').html("<font size='3' color='red' face='楷体'>用户昵称\""+ result +"\"已经存在!</font>");							
				nickname_can= false				;
			}else {
				$('#pnickname_tip').html("<font size='3' color='#66CDAA' face='楷体'>用户可以使用</font>");
				nickname_can = true;
			}
			$('#pnickname_tip').show();
		});
	}	
});

$('#tver').change(function(){
	var s = $('#tver').val();	
	$.post('Do_getVerification',function(result){
		var s1 = result;
		if (s==""){
			$('#pver_tip').hide();
			ver_can = false;
		} else if (s==s1){
			$('#pver_tip').html("<font size='3' color='#66CDAA' face='楷体'>验证码正确</font>");
			ver_can = true;	
			$('#pver_tip').show();
		} else {
			$('#pver_tip').html("<font size='3' color='red' face='楷体'>验证码不正确</font>");
			ver_can = false;
			$('#pver_tip').show();
		}		
	});	
});

$('#bsubmit').click(function(){
	$('#ff').submit();
});

$('#ff').submit(function(event){
	if (check(email_can, password_can, nickname_can, ver_can, repassword_can)==false){
		event.preventDefault();//此处阻止提交表单
	}
});

});
</script>

<script type="text/javascript">
function check(arg0, arg1, arg2, arg3, arg4){
	if (arg0 && arg1 && arg2 && arg3 && arg4){
		return true;
	} else if (!arg0){
		$('#temail').focus();		
	} else if (!arg1){
		$('#ppassword').focus();
	} else if (!arg4){
		$('#prepassword').focus();
	} else if (!arg2){
		$('#tnickname').focus();
	} else if (!arg3){
		$('#tver').focus();
	}
	return false;
}
</script>

</head>
<body style="background:#F0FFF0;">
<br /><br /><br /><br /><br />
<center>
<div style="background:#FFFFFF;padding:0px;width:40%;height:100%;">
<p class="ridge">在这里快速注册Coding账号吧</p>
<br />

	<form id="ff" action="User_register" method="post"><table border="0">	
	<tr>
		<td align="right"><font color="red">* </font><label>邮箱:</label></td>
		<td>
			<input id="temail" size="30" type="text" name="uvo.U_EMAIL"/>
			<div id="pemail_tip" class="easyui-panel" border="0"></div>			
		</td>
	</tr>
	<tr>
		<td align="right"><font color="red">* </font><label>密码:</label></td>
		<td>
			<input id="ppassword" size="30"  type="password" name="uvo.U_PASSWORD"/>
			<div id="ppassword_tip" class="easyui-panel" border="0"></div>	
		</td>
    </tr>	
    <tr>	
		<td align="right"><font color="red">* </font><label>密码确认:</label></td>
		<td>
			<input id="prepassword" size="30" type="password" name="uvo.reU_PASSWORD"/>
			<div id="prepassword_tip" class="easyui-panel" border="0"></div>
		</td>
	</tr>	
	<tr>	
		<td align="right"><font color="red">* </font><label>昵称:</label></td>
		<td>
			<input id="tnickname" size="30" type="text" name="uvo.U_NICKNAME" />
			<div id="pnickname_tip" class="easyui-panel" border="0"></div>
		</td>
	</tr>
	<tr>
		<td align="right"><font color="red">* </font><label>验证码:</label></td>
		<td>
			<img name="randImage" id="randImage" src="Do_verification" width="60" height="20" border="1" align="absmiddle">
			<a href="javascript:void(0)" onClick="document.getElementById('randImage').src='Do_verification';">看不清楚</a>
			<br/>
			<input id="tver" size="30" type="text" name="uvo.verification" />
			<div id="pver_tip" class="easyui-panel" border="0"></div>
		</td>
	</tr>
	<tr>		
		<td><input type="hidden" name="token" value="<%=token %>"/></td>
		<td><button id="bsubmit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only">
						<span class="ui-button-text">注册</span></button></td>
	</tr>
	</table>
	</form>
</div>
</center>	
</body>
</html>